<template>
  <div class="main">
    <div class="item">
      <div class="item-label">姓名:</div>
      <div class="item-content">{{store.state.personalInfo.name}}</div>
    </div>
    <div class="item">
      <div class="item-label">性别:</div>
      <div class="item-content">{{store.state.personalInfo.sex}}</div>
    </div>
    <div class="item">
      <div class="item-label">年龄:</div>
      <div class="item-content">{{store.state.personalInfo.age}}</div>
    </div>
    <div class="item">
      <div class="item-label">身份证号码:</div>
      <div class="item-content">{{store.state.personalInfo.idCardNo}}</div>
    </div>
    <div class="item" v-if="store.state.personalInfo.icCardNo">
      <div class="item-label">社保卡号:</div>
      <div class="item-content">{{store.state.personalInfo.icCardNo}}</div>
    </div>
    <div class="item" v-if="store.state.personalInfo.address">
      <div class="item-label">地址:</div>
      <div class="item-content">{{store.state.personalInfo.address}}</div>
    </div>
  </div>
</template>

<script lang="ts">
import { Component } from 'vue-property-decorator'
import { mixins } from 'vue-class-component'
import BaseMixin from '@/mixins/base'

@Component
export default class Detail extends mixins(BaseMixin) {
  private async created () {
    this.client = this.store.state.client
    this.setTip('您的档案信息:')
    this.setMaxTime(60)
    this.updateTimeHandler('home')
  }
}

</script>

<style scoped>
  .main{
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    align-content: center;
  }
</style>
